<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Search Results</title>
</head>
<body>
    <h1>Search Results for "{{ key }}"</h1>
    <ul>
        {% for song in songs %}
            <li>
                {{ song.songname }} by {{ song.singer }}
                - [ <a href="/play/{{ song.songmid }}">Play</a> ]
                - [ <a href="/download/{{ song.songmid }}">Download</a> ]
            </li>
        {% endfor %}
    </ul>
    <a href="/">Back to search</a>
</body>
</html>



 document.getElementById('searchForm').addEventListener('submit', function(event) {
            event.preventDefault();
            const query = document.getElementById('searchQuery').value;
            fetch(`/search?query=${query}`)
                .then(response => response.text())
                .then(html => {
                    document.getElementById('results').innerHTML = html;
                })
                .catch(error => console.error('Error loading data:', error));
        });
        function playMusic(link, title, element) {
            const player = document.getElementById('audioPlayer');
            const source = document.getElementById('audioSource');
            source.src = link;
            player.load();
            player.play();
            document.title = title; // 更新标签页标题为歌曲名
            const currentlyPlaying = document.querySelector('.playing');
            if (currentlyPlaying) {
                currentlyPlaying.classList.remove('playing');
            }
            element.classList.add('playing');
        }